<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>问卷模板</title>
        <link href="/static/lib/layui/css/layui.css" rel="stylesheet"/>
        <link href="/static/css/style.css" rel="stylesheet">
        <style>
            .layui-card {
                box-shadow: 0 0 8px #ccc;
            }
            .layui-card:hover{
                box-shadow: 0 0 10px #1E9FFF;
            }
            .layui-card-body{
                height: 80px;
                color: #808080;
                font-size: 13px;
            }
        </style>
    </head>
    <body>
        <div th:insert="~{header}"></div>
        <div th:insert="~{questionnaire_template_search_div}"></div>
        <div class="layui-container" style="margin-top:10px;margin-bottom: 20px">
            <h1 style="margin: 20px 0"><i class="layui-icon layui-icon-list" style="font-size: 35px"></i>调查问卷模板：</h1>
            <div class="layui-row layui-col-space20">
                <div class="layui-col-md4" th:each="category : ${categories}">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            <a th:href="'/template/list/'+${category.id}">
                                <h3 th:text="${category.typeName}"></h3>
                            </a>
                        </div>
                        <div class="layui-card-body" th:text="${category.typeDesc}"></div>
                    </div>
                </div>
            </div>
        </div>
        <div th:insert="footer.html" style="position: fixed;bottom: 0;left: 0;right: 0"></div>
    </body>
    <script src="/static/lib/layui/layui.all.js"></script>
    <script src="/static/lib/jquery-1.9.1.min.js"></script>
</html>